import { useState } from "react"

import styles from "@/views/learn/hooks/style/styles"

import InitialDrill from "@/views/learn/hooks/state/InitialDrill"
import ResetStatus from "@/views/learn/hooks/state/ResetStatus"

function HookState() {

    // 取出样式
    const { hooksBox } = styles

    // 通过key 更新组件
    const [version, setVersion] = useState(0);
    function handleReset() {
        setVersion(version + 1);
    }

    // 

    return (
        <>
            <div style={hooksBox.mb5}>
                <InitialDrill />
            </div>
            <div style={hooksBox.mb5}>
                重置组件：
                <button onClick={handleReset}>重置</button>
                <ResetStatus key={version} />
            </div>
        </>
    )

}


export default HookState